<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <!-- <meta http-equiv="X-UA-Compatible" content="ie=edge"> -->
        <title>无敌基本输入例2</title>
        <style>
            *{
                margin: 0px;
                padding: 0px;
            }
        </style>
    </head>
         <!-- 字体颜色为红色；背景颜色为蓝色；宽度为400px；高度为40px；行高为40px；文字的水平对齐方式为居中 -->
     <!-- 当height的值  =  line-height的值；文字在元素中竖直方向居中 -->
    <!-- <p style='color:red;background:blue;width: 400px;height: 40px;line-height: 40px;text-align: center;'>张三</p>
    <p style='color:red;background:blue;width: 400px;height: 40px;line-height: 40px;text-align: center;'>张三</p>
    <p>张三</p> -->
    <body style="background-color: antiquewhite;">
        <h2 style="background-color: rgb(33, 186, 120); width: 300px; height: 40px;text-align: center; line-height: 40px;">春晓</h2>
        <p style="color: brown; width: 300px; height: 40px; text-align: center;line-height: 40px;">春眠不觉晓</p>
        <p style="height: 40px; width: 300px; color:rgb(89, 143, 35);text-align: center; line-height: 40px;">处处闻啼鸟</p>
        <p style="height: 40px; width: 300px; line-height: 40px; color: blue; text-align: center;">风啸灯枯影曳流离</p>
        <p style="width: 300px; height: 40px; text-align: center;line-height: 40px; color: violet;">花落知多少</p>
        <!-- <p style="width: 300px;color: violet; text-align: center;">花落知多少</p>
        <p style="width: 300px;color: violet;text-align: center;">花落知多少</p>
        <p style="width: 300px;color: violet;text-align: center;">花落知多少</p>
        <p style="width: 300px;color: violet;text-align: center;">花落知多少</p> -->
    </body>
</html>